<template>
  <div class="box">
    <avue-crud ref="crud"
               v-model="form"
               :page="page"
               :before-open="beforeOpen"
               :data="tableData"
               :table-loading="tableLoading"
               :option="tableOption"
               @on-load="getList"
               @search-change="searchChange"
               @refresh-change="refreshChange"
               @size-change="sizeChange"
               @current-change="currentChange"
               @row-update="handleUpdate"
               @row-save="handleSave"
               @row-del="rowDel">
      <template slot="menu" slot-scope="scope">
        <el-button v-if="buttonPermissionsCheck('SYS_MENU_ADD')" :size="scope.size" @click="handleAdd(scope.row)" type="text">
          添加
        </el-button>
      </template>
    </avue-crud>
  </div>
</template>

<script>
  import * as u from '@/util/util'
  import {tableOption} from '@/js/sys/menu/list.js'
  import tableMixins from "@/mixins/tableMixins.vue"
  export default {
    name: "menuList",
    mixins:[tableMixins],
    data() {
      return {
        //访问接口前缀
        url:"sys-menu",
        // 表格参数
        tableOption: tableOption,
        //弹框显示判断
        dialogVisible:false,
        //角色集合
        roles:[],
        //设置的角色集合
        rolesVal:[],
      }
    },
    methods: {
      /**
       * 自定义新增
       */
      handleAdd(row) {
        this.obj = row;
        this.$refs.crud.rowAdd();
      },


      beforeOpen(done, type) {
        setTimeout(() => {
          this.form.pid = this.obj.id
          this.obj = {};
        }, 0)
        done();
      },


      /**
       * 新增保存
       * @param row 行数据
       * @param done 完成回调
       * @param loading 加载回调
       */
      handleSave: function (row, done, loading) {
        if(row.pid=='' || row.pid==null){
          row.pid=0;
        }
        u.post("/sys-menu/add", row).then(res=>{
          this.$message.success('新增成功');
          this.getList();
          done();
        })
        loading();
      },


      /**
       * 获取列表数据
       * @param page 分页参数
       * @param params 查询条件
       */
      getList(page, params) {
        this.tableLoading = true;
        let query = Object.assign({}, this.searchForm, this.page);
        u.get("/sys-menu/findMenuTree", query).then(res=>{
          this.tableData = res;
          this.tableLoading = false;
        })
      },
    }
  }
</script>

<style scoped>

</style>
